$(function () {
    init();

    function init() {

        //2.下拉刷新组件
        mui.init({
            pullRefresh: {
                container: ".lt_view",//下拉刷新容器标识，querySelector能定位的css选择器均可，比如：id、.class等
                down: {
                    auto: true,//可选,默认false.首次加载自动上拉刷新一次
                    callback: function () {
                        //3.1 调用函数
                        getQueryProductDetail(function () {
                            //2.1 正确结束下拉组件
                            mui('.lt_view').pullRefresh().endPulldownToRefresh();
                        });
                    } //必选，刷新函数，根据具体业务来编写，比如通过ajax从服务器获取新数据；
                }
            }
        });

        eventList();
    }

    //绑定一坨事件
    function eventList() {
        //5.点击尺码的时候添加属性样式
        $(".lt_content").on("tap",".size_btn",function () {
            $(this).addClass("active").siblings().removeClass("active");
        });

        //6.添加购物车
        $(".add_cart").on("tap",function () {
            /* 
            1.判断是否选择尺码
                否->提示用户 return
            2.判断是否登录
                否->跳转到登录页面
            3.发送请求-添加购物车
                1.失败返回值,错误信息-提示未登录
                2.成功{"success": true"}
            */

        //6.1判断是否选中尺码 // $() 获取到的对象是一个伪数组 
        var sizeLength = $(".size_btn.active").length;
        //判断 获取不到 长度 0 获取到 长度1
        if (sizeLength == 0) {
            mui.toast("请选择尺码");
            return;
        }

        //7./cart/addCart 请求后台数据,判断是否登录或者跳转到购物车页面
        //7.1 构造函数 发送请求
        var params = {
            productId: $.getQueryString("productId"),
            size:$(".size_btn.active").text(),
            num:$(".num_val").val()
        };
       console.log(params);
        // return ;
        //7.2 发送请求
        $.post(location.origin + "/cart/addCart", params,function (data) {
            // console.log(data);
            //7.3 判断是否登录 跳转页面
            // 400 是后台自己规定 不是http状态码
            if (data.error && data.error == 400) {
                //7.4提示用户
                mui.toast(data.message);
                //7.5 设置定时器,一秒后跳转到登录页面
                setTimeout(function () {
                   //7.6使用会话存储,把当前页面地址存储起来,成功登录后返回当前页面
                   sessionStorage.setItem("pageName",location.href);
                   location.href = "./login.html"; 
                },1000);
            }else if(data.success){
                //使用mui提示框组件 提示用户是否跳转页面
                mui.confirm("提交成功,是否要跳转页面","提示",["是","否"],function (etype) {
                    //判断当索引等于0的时候表示 是
                    if (etype.index == 0) {
                        location.href="./cart.html";
                    }else if(etype.index==1){
                        //判断当索引等于1的时候表示 否
                    }
                })
            }
            
        });
        })
    }


    //3.获取商品的详情,动态渲染页面
    // /product/queryProductDetail
    function getQueryProductDetail(callback) {
        //3.2 获取搜索列表传递过来的id值
        var id = $.getQueryString("productId");
        // console.log(id);
        $.get(location.origin + "/product/queryProductDetail?id=" + id ,function (data) {
            console.log(data); 
            
        //4.5 调用formatSize函数
        //在渲染页面前把获取到的数组存到数据中
        data.sizeArr = formatSize(data.size);
        console.log(data);
        

        //3.3 获取数据渲染页面
        var html = template("mainTpl",data);
        $(".lt_content").html(html);
        
        //1.获得slider插件对象  轮播图  渲染数据后在初始化轮播图
        var gallery = mui('.mui-slider');
        gallery.slider({
            interval: 5000//自动轮播周期，若为0则不自动播放，默认为0；
        });

        //1.1 初始化 数字输入框!!  必须初始化,不然渲染模板的时候会出错
        mui(".mui-numbox").numbox()

        //调用callback函数
        callback&&callback();
            
        })
    }

    //4.把size数据里面的字符创转换成数组
    function formatSize(str) {
        //4.1 获取40字符串
        var startNum = str.split("-")[0];
        // console.log(startNum);
        
        //4.2 获取50字符串
        var endNum = str.split("-")[1];
        // console.log(endNum);

        //4.3 声明存储数组变量
        var arr = [];

        //4.4 循环,将数据存到数组
        for (var i = startNum; i <= endNum; i++) {
           arr.push(i);
        }
        //返回arr的结果
        return arr;
    }
})